import React, { PureComponent } from 'react';
// 引入框架
import { Collapse, Button, message } from 'antd';
// 引入请求
import Axios from 'axios';
// 引入接口
import { webSite } from '../../website';
// 引入样式
import './kingfriend.scss';
const { Panel } = Collapse;
export default class Kingfriend extends PureComponent {
  constructor() {
    super()
    this.state = {
      // 显示
      isTrue: false,
      // 已审核
      friendtrue: [],
      // 未审核
      friendfalse: []
    }
  }
  componentDidMount () {
    const _this = this;
    if (sessionStorage.getItem('password')) {
      Axios.create({
        baseURL: `${webSite}:3003`
      }).post("/King", { password: sessionStorage.getItem('password') }).then(err => {
        if (err.data.code === 'K0001') {
          // 密码正确显示页面
          _this.setState({
            isTrue: true
          }, () => {
            _this.pistFriend()
          })
        } else {
          // 没有网络连接就返回管理员页面
          _this.props.history.replace('/king');
        }
      }).catch(() => {
        // 没有网络连接就返回管理员页面
        this.props.history.replace('/king');
      })
    } else {
      // 没有密码就返回管理员页面
      this.props.history.replace('/king');
    }
  }
  // 请求 
  pistFriend = () => {
    const _this = this;
    Axios.create({
      baseURL: `${webSite}:3003`
    }).post("/friendAll").then(err => {
      if (err.data.code === 'F0001') {
        _this.setState({
          // 已审核
          friendtrue: err.data.friendtrue,
          // 未审核
          friendfalse: err.data.friendfalse
        })
      }
    }).catch(() => {
      message.info({ content: '网络错误', className: 'bulletChatMessage' })
    })
  }
  // 设置是否过审
  ClickFun = (list) => {
    // 初始化一个值
    let isF = 0;
    list.friendtrue === 1 ? isF = 2 : isF = 1;
    const _this = this;
    Axios.create({
      baseURL: `${webSite}:3003`
    }).post("/setFriendAll", { id: list.id, isF: isF }).then(err => {
      if (err.data.code === 'S0001') {
        // 更改成功后重新发送请求
        _this.pistFriend();
      }
    }).catch(() => {
      message.info({ content: '网络错误', className: 'bulletChatMessage' })
    })
  }
  render () {
    let { isTrue, friendtrue, friendfalse } = this.state;
    // 颜色值
    let color = ['#fd6a7f', '#70c3ff', '#7f8ea0', '#89d04f', '#888069', '#998899'];
    return (
      <div className='kingfriend'>
        {
          isTrue ?
            <div className='kingfriend_body'>
              <Collapse defaultActiveKey={['1', '2']} onChange={() => { }} className='kinghome_Panel_coll'>
                <Panel header="已审核" key="1">
                  <ul className='kinghome_Panel_ul'>
                    {
                      friendtrue.length !== 0 ?
                        friendtrue.map((list, index) => {
                          return (
                            <li key={index}>
                              <div className='kinghome_Panel_li_body'>
                                <b>qq：{list.frienduser}</b>
                                <b>性别：{list.sex === 2 ? '女' : '男'}</b>
                                <b>用户：{list.user}</b>
                                <Button style={{ background: color[Math.floor(Math.random() * color.length)] }} className='kinghome_Panel_li_body_btn' onClick={() => this.ClickFun(list)}>隐藏</Button>
                              </div>
                              <div className='kinghome_Panel_li_title'>{list.friendtext}</div>
                            </li>
                          )
                        })
                        : ''
                    }
                  </ul>
                </Panel>
                <Panel header="未审核" key="2">
                  <ul className='kinghome_Panel_ul'>
                    {
                      friendfalse.length !== 0 ?
                        friendfalse.map((list, index) => {
                          return (
                            <li key={index}>
                              <div className='kinghome_Panel_li_body'>
                                <b>qq：{list.frienduser}</b>
                                <b>性别：{list.sex === 2 ? '女' : '男'}</b>
                                <b>用户：{list.user}</b>
                                <Button style={{ background: color[Math.floor(Math.random() * color.length)] }} className='kinghome_Panel_li_body_btn' onClick={() => this.ClickFun(list)}>过审</Button>
                              </div>
                              <div className='kinghome_Panel_li_title'>{list.friendtext}</div>
                            </li>
                          )
                        })
                        : ''
                    }
                  </ul>
                </Panel>
              </Collapse>
            </div>
            : ''
        }
      </div>
    )
  }
}